<div class="blade-content __large-wide ng-scope" id="blade-content">
  <div class="blade-inner">
    <div class="inner-block">
      <form name="form" class="form" [formGroup]="formGroup" novalidate>
        <div class="column">
          <div class="form-group">
            <label class="form-label">状态名称</label>
            <div class="form-input">
              <input readonly id="stateName" name="stateName" type="text" placeholder="状态名称" autocomplete="off" formControlName="stateName">
            </div>
          </div>

          <div class="form-group">
            <label class="form-label">状态表达式</label>
            <div class="form-input">
              <textarea id="expression" name="expression" placeholder="状态表达式" class="form-control" formControlName="expression" rows="4"
                cols="25"></textarea>
            </div>
             <div *ngIf="formErrors.expression" class="form-error">
              {{ formErrors.expression }}
            </div>  
          </div>

          <div class="form-group">
            <label class="form-label">输入值</label>
            <div class="form-input">
              <input id="inputValue" name="inputValue" type="text" placeholder="输入值" autocomplete="off" [ngModelOptions]="{standalone: true}" [(ngModel)]="inputValue" >
            </div>
          </div>

          <div class="form-group">
            <label class="form-label">结果</label>
            <div class="form-input">
              <input readonly type="text" placeholder="结果" autocomplete="off" value={{result}}>
            </div>
          </div>

          <div class="form-group">
            <div >
              <button (click)="onLogicValid()" class="btn">表达式验证</button>              
              <!-- <button (click)="onLogicEval()" class="btn">表达式求值</button> -->
            </div>
          </div> 

          <div class="form-group">
            <label class="form-label">表达式语法与风机状态表达式一致</label>
          </div>
        </div>  
      </form>
    </div>
  </div>
</div>
